<template>
    <div id="app">
        <Goodshlnput @add="handleAdd" :old="old"/>
        <GoodsTable :target="target" :goodsList="goodsList" @del="handleDel"/>
    </div>

</template>
<script>
import Goodshlnput from'./goodshlnput.vue';
import GoodsTable from './goodsTable.vue';
export default{
    
    data() {
        return {
            goodsList: [
                {
                    id: 1,
                    code: 1,
                    imgSrc: "https://tse1-mm.cn.bing.net/th/id/R-C.fc48d5b3c65b7b79980ab09dfc2890d8?rik=jy07dRFBQAwjzw&riu=http%3a%2f%2f5b0988e595225.cdn.sohucs.com%2fimages%2f20190322%2fe2edee9d2ee847f0b564fcbadf356a46.jpeg&ehk=cKT9XpGfozyLcO5sia93t8gLeJurN9RM%2boqkkCk6a7Q%3d&risl=&pid=ImgRaw&r=0&sres=1&sresct=1",
                    productName: "坤坤的背带裤",
                    price: 9.9,
                    count: 1
                },
                {
                    id: 2,
                    code: 2,
                    imgSrc: "https://tse3-mm.cn.bing.net/th/id/OIP-C.U2zPWJK7Gus24zXyQWwi0AHaEG?pid=ImgDet&rs=1",
                    productName: "品如的衣服",
                    price: 19.9,
                    count: 1
                },
                {
                    id: 3,
                    code: 3,
                    imgSrc: "https://static1.paizi.com/uploadfile/2018/0710/20180710095354871.jpg",
                    productName: "秀儿的秋裤",
                    price: 1.9,
                    count: 1
                },
            ],
            target:{},
            old:[]
        }
    },
    created(){
        this.old=[...this.goodsList]
    },
    components: { Goodshlnput, GoodsTable },
    methods:{
        handleAdd(input){
            this.goodsList.push(input);
        },
        handleDel(input){
           let target= this.goodsList.splice(input,1);
            this.$set(this,"target",target[0])
        }
    },
    
}
</script>
<style scoped >
#app {
    width: 600px;
    margin: 10px auto;
}
</style>